<template>
    <div class="box">
      <header>
        <ul>
          <li class="logo">
            <img src="../assets/img/logo_2.png"/>
          </li>
          <li class="title">
            <p class="phone">136****4251</p>
            <p class="vip">普通会员</p><img src="../assets/img/4-1tu_13.png" height="43" width="43" />
            <p class="time">注册时间：2017-06-05</p>
          </li>
          <li class="renzheng">
            <p>来认证</p>
          </li>
        </ul>
      </header>
      <div class="main">
          <ul class="myIndent">
              <li><p>我的订单</p></li>
              <li class="menuList">
                  <div v-for="item in listData">
                    <router-link :to="item.path">
                      <img :src="item.url"/>
                      <p>{{item.text}}</p>
                    </router-link>
                  </div>
              </li>
              <router-link to="4-5qianyuechaxun">
              <li class="hetong"> 实体店纸质合同查询 <img src="../assets/img/1-1shouye_33.png"  /></li>
              </router-link>
          </ul>
          <ul  class="myList">
              <li v-for="item in  fenleiData" :id="item.id">
                
                <img :src="item.url" />
                <p>{{item.text}}</p>
                <router-link :to="item.path">
                <span>{{item.text2}}</span>
                </router-link>
              </li>
          </ul>
          <ui class="quit">
              <li>
                <p>货币正在贬值</p>
                <p>持有黄金是避免资产膨胀的有效方法</p>
                <span>退出登录</span>
              </li>
          </ui>
      </div>
    </div>
</template>

<script>
 
export default {
  name: 'box',
  data () {
    return{
        listData:[
          {url:"static/img/4-1tu_1.png",text:"提货车",path:"4-2tihuodan"},
          {url:"static/img/4-1tu_2.png",text:"存金车",path:"4-3cuijindan"},
          {url:"static/img/4-1tu_3.png",text:"换购车",path:"4-4huangoudan"}
        ],
        fenleiData:[
          {url:"static/img/4-1tu_5.png",text:"我的银行卡",text2:"去认证"},
          {url:"static/img/4-1tu_6.png",text:"安全中心" ,path:"4-6anquanzhongxin"},
          {url:"static/img/4-1tu_7.png",text:"邀请好友" ,text2:"返1元现金"},
          {url:"static/img/4-1tu_8.png",text:"客服专线" ,text2:"400-610-6998"},
          {url:"static/img/4-1tu_9.png",text:"交易规则"},
          {url:"static/img/4-1tu_10.png",text:"意见反馈"},
          {url:"static/img/4-1tu_11.png",text:"常见问题"},
          {url:"static/img/4-1tu_12.png",text:"关于我们"}
        ]
    }
  },
  
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="less">
   @import ".././assets/less/1-3jinxijieshao.less";
   @import ".././assets/css/reset.css";
</style>
    
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="less">
   @import ".././assets/less/4-1dengduo.less";
   @import ".././assets/less/style.less";
   @import ".././assets/css/reset.css";
</style>